<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>设置密保问题</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
</head>
<body>
<div class="container mt-5">
    <h2>设置密保问题</h2>
    <p class="text-muted">密保问题用于找回账号，请设置至少一组问题和答案</p>
    
    <form method="post" action="{{ url_for('security_questions') }}">
        <div class="card mb-4">
            <div class="card-header bg-primary text-white">
                <h5 class="mb-0">密保问题设置</h5>
            </div>
            <div class="card-body">
                <!-- 第一组问题 -->
                <div class="mb-3">
                    <label for="question1" class="form-label">问题1</label>
                    <input type="text" class="form-control" id="question1" name="question1" 
                           value="{{ current_user.security_question1 or '' }}" required>
                </div>
                <div class="mb-3">
                    <label for="answer1" class="form-label">答案1</label>
                    <input type="text" class="form-control" id="answer1" name="answer1" required>
                </div>
                
                <!-- 第二组问题 -->
                <div class="mb-3">
                    <label for="question2" class="form-label">问题2 (可选)</label>
                    <input type="text" class="form-control" id="question2" name="question2"
                           value="{{ current_user.security_question2 or '' }}">
                </div>
                <div class="mb-3">
                    <label for="answer2" class="form-label">答案2 (可选)</label>
                    <input type="text" class="form-control" id="answer2" name="answer2">
                </div>
                
                <!-- 第三组问题 -->
                <div class="mb-3">
                    <label for="question3" class="form-label">问题3 (可选)</label>
                    <input type="text" class="form-control" id="question3" name="question3"
                           value="{{ current_user.security_question3 or '' }}">
                </div>
                <div class="mb-3">
                    <label for="answer3" class="form-label">答案3 (可选)</label>
                    <input type="text" class="form-control" id="answer3" name="answer3">
                </div>
                
                <div class="alert alert-info">
                    <i class="bi bi-info-circle"></i> 提示：密保问题和答案区分大小写，请牢记您设置的答案
                </div>
                
                <button type="submit" class="btn btn-primary">保存设置</button>
                <a href="{{ url_for('account_security') }}" class="btn btn-outline-secondary">取消</a>
            </div>
        </div>
    </form>
</div>
</body>
</html>
